﻿<%@ Page Title="" Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="Templates_Systems_Default" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
<style>

</style>

<script>
// execute your scripts when the DOM is ready. this is mostly a good habit
    $(function() {
        $(".hotSpot").tooltip({});

        $("a.navApplication").bind("click", function() {
            pos = $(this).parent().index();
            //alert(pos);
            $("a.navApplication").removeClass("active");
            $(".items .item").hide();
            $(this).addClass("active");
            //this.parent
            //alert(pos);
            $('.items .item:eq('+pos+')').show();
            return false
        });
    });
</script>


</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="contentTop" Runat="Server">

<div id="top" style="position:relative" class="systemHolder">
    <div class="systemPanels">
        <div class="items">
            <div class="item systemsSpecification">
                <a class="hotSpot" style="left:435px; top:125px; ">More Info</a>
                <div class="tooltip">
                    <h3><span>System One</span></h3>
                    <p>The quick brown fox.</p>
                </div>
                <a class="hotSpot" style="left:495px; top:30px; ">More Info</a>
                <div class="tooltip">
                    <h3><span>System Two</span></h3>
                    <p>Jumped over the lazy dog.</p>
                </div>
            </div>
            
            <div class="item systemsApplication">
                <a class="hotSpot" style="left:435px; top:125px; ">More Info</a>
                <div class="tooltip">
                    <h3><span>Application One</span></h3>
                    <p>The quick brown fox.</p>
                </div>
            </div>
            
            <div class="item systemsGroundStation">
                <a class="hotSpot" style="left:695px; top:70px; ">More Info</a>
                <div class="tooltip">
                    <h3><span>Ground Station</span></h3>
                    <p>Where are all the good times?</p>
                </div>
            </div>
            
            
            
        </div>
    </div>
    <%--<a class="prev browse left">---</a><a class="next browse right">|||</a>--%>

    <div id="subNav" style="" class="clearfix">
        <ul id="navApplications">
            <li class="active" ><a href="#" class="navApplication navCivil"></a></li>
            <li ><a href="#" class="navApplication navMaritime"></a></li>
            <li ><a href="#" class="navApplication navMilitary"></a></li>
        </ul>
        
        <ul id="navDetails">
            <li><a href="#" class="navSystems"></a></li>
            <li><a href="#" class="navApplications active"></a></li>
        </ul>
        
    </div>
    <div id="pageTitle" class="clearfix">
            <h1><acms:PostDisplayName ID="PostDisplayName" runat="server" /></h1>
            <%--<a href="#" id="moreInfo" class="off">More Info</a>--%>
        </div>
</div>
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="ContentBase" Runat="Server">
</asp:Content>

